<template>
  <el-dialog v-bind="config__" :before-close="cancel" show-close>
    <template #default>
      <el-form ref="form" :model="data__" label-width="150px"
               :disabled="status__.DIALOG_STATUS === options__.DIALOG_TYPE.DETAIL" v-loading="config__.dialogLoading">
        <el-form-item label="退款模式" prop="returnSet" verify>
          <el-radio-group class="returnSet" v-model="data__.returnSet">
            <el-radio :label="1">可以退款，不需要审核</el-radio>
            <el-radio :label="2">可以退款，需要审核</el-radio>
            <el-radio :label="0">不可退款，后台可手动退款</el-radio>
          </el-radio-group>
          <form-item-tip>如果对接票务系统门票，需要退款审核的票通过后才提交退款申请给票务系统</form-item-tip>
        </el-form-item>

        <el-form-item label="可退款天数控制" prop="returnDays">
          游玩日开始前
          <SafeInputNumber
            :disabled="data__.returnSet === 0"
            style="width: 150px; margin: 0 10px"
            v-model="data__.returnDays"
            :min="0"
            :max="5"
            :precision="0"
          />
          天的
          <el-time-picker
            :disabled="data__.returnSet === 0"
            v-model="data__.returnTime"
            format="HH:mm"
            value-format="HH:mm"
            style="width: 150px; margin: 0 10px"
            placeholder="选择时间"
          />
          前可以退款
          <form-item-tip>可以退款时可设置，0 ~ 5天，设置了该项，该时间之前都可以退款。设置0则游玩日当日可退款，设置1则游玩日当日不可退款</form-item-tip>
        </el-form-item>
        <!-- 票务商品隐藏该项 -->
        <!-- <el-form-item class="expireReturn" label="只退款，不退票" prop="expireReturn">
          <el-switch v-model="data__.expireReturn" active-text="已检票状态的票，后台可手动退款（只退款，不退票）" :active-value="1" :inactive-value="0" active-color="#13ce66" inactive-color="#909399" />
          <form-item-tip>不管票是否为可退款，开启后，已检票状态的票，后台管理员可主动给游客退款，但不会退票。需要保证：1.支付渠道已授权平台API退款。2.我的银行卡里有余额足够退款。3.退款成功，票务系统可能并未退票</form-item-tip>
        </el-form-item>                -->
      </el-form>
    </template>

    <template #footer v-if="!isPlatFormUser">
      <el-button @click="config__.visible = false">取消</el-button>
      <el-button type="primary" @click="onSubmit" :loading="config__.confirmLoading">
        {{ config__.confirmLoading ? '更新中' : '确定' }}
      </el-button>
    </template>
  </el-dialog>
</template>

<script>
import { mapGetters } from 'vuex'
import ENUMS from '../../enums'

const DIALOG_TYPE = {
  CREATED: 'CREATED',
  DETAIL: 'DETAIL',
  UPDATE: 'UPDATE'
}

export default {
  props: {
    visible: {
      type: Boolean,
      default: false
    }
  },
  computed: {
    ...mapGetters(['isPlatFormUser']),
  },
  data () {
    return {
      data__: {
        productId: undefined, // 产品id
        expireReturn: 0, // 过期是否可以后台返回，默认否 - 0
      },
      config__: {
        width: '800px',
        top: '8vh !important',
        visible: false,
        title: '退款设置（不设置时，无限制）',
        showClose: false,
        lockScroll: true,
        closeOnClickModal: false,
        customClass: 'el-ticket-refund',
        confirmLoading: false,
        dialogLoading: false,
        destroyOnClose: true
      },
      status__: {
        DIALOG_STATUS: DIALOG_TYPE.CREATED
      },
      options__: {
        DIALOG_TYPE
      }
    }
  },
  mounted () {
    this.$bus.on('ticket-refund:open', params => this.open(params, DIALOG_TYPE.CREATED))
    this.$bus.on('ticket-refund:create', params => this.open(params, DIALOG_TYPE.CREATED))
    this.$bus.on('ticket-refund:detail', params => this.open(params, DIALOG_TYPE.DETAIL))
    this.$bus.on('ticket-refund:update', params => this.open(params, DIALOG_TYPE.UPDATE))
  },
  destroyed () {
    this.$bus.off('ticket-refund:open')
    this.$bus.off('ticket-refund:create')
    this.$bus.off('ticket-refund:detail')
    this.$bus.off('ticket-refund:update')
  },
  methods: {
    open (id, type) {
      this.status__.DIALOG_STATUS = type
      this.data__.productId = id
      this.config__.visible = true
      this.config__.dialogLoading = true
      // 获取票务产品退票设置
      return this.$POST(ENUMS.ENUM_URL_PREFIX['1'] + '/queryReturnLimitById', {
        id: this.data__.productId
      }).then(({ data }) => {
        this.data__ = data
      }).finally(_ => {
        setTimeout(() => { this.config__.dialogLoading = false }, 300)
      })
    },
    cancel () {
      this.config__.visible = false
      Object.assign(this.$data, this.$options.data.call(this))
    },
    // 事件 - 提交
    onSubmit () {
      // 产品id检查
      if (!this.data__.productId) {
        this.$swal('产品id不存在, 请检查')
        return
      }

      // 表单校验
      this.$refs.form.validate(valid => {
        if (valid) {
          // 更新票务产品退票设置
          this.config__.confirmLoading = true
          return this.$POST(ENUMS.ENUM_URL_PREFIX['1'] + '/updateReturnSetting', {
            ...this.data__ // 所有参数
          }).then(() => {
            this.$swal.success('更新退购设置成功')
            this.$bus.emit('table:refresh')
            this.cancel()
          }).finally(_ => {
            setTimeout(() => { this.config__.confirmLoading = false }, 300)
          })
        }
      })
    }
  }
}
</script>

<style lang="scss">
.el-ticket-refund {
  .returnSet {
    margin-top: 8px;
    line-height: 30px;
  }
}
</style>
